import Vue from 'vue'
import VueRouter, { RouteConfig } from 'vue-router'
import Layout from '@/layout/index.vue'

Vue.use(VueRouter)

/**
 * 固定的路由
 */
export const constantRoutes: Array<RouteConfig> = [
    {
        path: '/redirect',
        component: Layout,
        meta: {
            hidden: true
        },
        children: [
            {
                path: '/redirect/:path(.*)',
                component: () =>
                    import(/* webpackChunkName: "redirect" */ '@/views/redirect/index.vue')
            }
        ]
    },
    {
        path: '/login',
        name: 'Login',
        meta: {
            hidden: true // 不需要在菜单上显示
        },
        component: () => import(/* webpackChunkName: "login" */ '@/views/login/index.vue')
    },
    {
        path: '/404',
        name: '404',
        meta: {
            hidden: true
        },
        component: () => import(/* webpackChunkName: "404" */ '@/views/404/index.vue')
    },
    {
        path: '/',
        component: Layout,
        redirect: '/home',
        children: [
            {
                path: 'home',
                name: 'Home',
                meta: {
                    title: '首页',
                    icon: 'user',
                    affix: true // 是否允许保留在tag-view上
                },
                component: () => import(/* webpackChunkName: "home" */ '@/views/home/index.vue')
            }
        ]
    }
]

/**
 * 这里的路由需要接口获取相对应的路由管理权限数据后，再根据数据做过滤
 */
export const asyncRoutes: Array<RouteConfig> = [
    {
        path: '/test-module1',
        component: Layout,
        redirect: '/test-module1/child1',
        meta: {
            title: '模块1',
            icon: 'user',
        },
        children: [
            {
                path: 'child1',
                name: 'module1-child1',
                meta: {
                    title: '菜单1',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module1-child1" */ '@/views/test-module1/child1.vue'
                    )
            },
            {
                path: 'child2',
                name: 'module1-child2',
                meta: {
                    title: '菜单2',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module1-child2" */ '@/views/test-module1/child2.vue'
                    )
            }
        ]
    },
    {
        path: '/test-module2',
        component: Layout,
        redirect: '/test-module2/child1',
        meta: {
            title: '模块2',
            icon: 'user',
        },
        children: [
            {
                path: 'child1',
                name: 'module2-child1',
                meta: {
                    title: '菜单1',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module2-child1" */ '@/views/test-module2/child1.vue'
                    )
            },
            {
                path: 'child2',
                name: 'module2-child2',
                meta: {
                    title: '菜单2',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module2-child2" */ '@/views/test-module2/child2.vue'
                    )
            }
        ]
    },
    {
        path: '/test-module3',
        component: Layout,
        redirect: '/test-module3/child1',
        meta: {
            title: '模块3',
            icon: 'user',
        },
        children: [
            {
                path: 'child1',
                name: 'module3-child1',
                meta: {
                    title: '菜单1',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module3-child1" */ '@/views/test-module3/child1.vue'
                    )
            },
            {
                path: 'child2',
                name: 'module3-child2',
                meta: {
                    title: '菜单2',
                    icon: 'user',
                    affix: true
                },
                component: () =>
                    import(
                        /* webpackChunkName: "test-module3-child2" */ '@/views/test-module3/child2.vue'
                    )
            }
        ]
    }
]

const createRouter = () =>
    new VueRouter({
        mode: 'hash',
        scrollBehavior: (to, from, savedPosition) => {
            if (savedPosition) {
                return savedPosition
            } else {
                return {
                    x: 0,
                    y: 0
                }
            }
        },
        base: process.env.BASE_URL,
        routes: constantRoutes
    })

const router = createRouter()

export function resetRouter() {
    const newRouter = createRouter()
    ;(router as any).matcher = (newRouter as any).matcher // reset router
}

export default router
